const frameComponentSuper = {
  data(new_data) {
    return function () {
      const data = Object.assign({
        width: 0,
        height: 0,
      }, new_data());
      return data;
    }
  },
  created(old_handle) {
    return function () {
      const offs = this.offs = [];
      this.clearWatch = () => {
        offs.forEach(unwatcher => unwatcher());
        offs.length = 0;
      };
      old_handle instanceof Function && old_handle.call(this);
    }
  },
  mounted(old_handle) {
    return function () {
      const root_node = this.$refs.root_node;
      this._resize_handler = () => {
        if (root_node) {
          this.width = root_node.clientWidth
          this.height = root_node.clientHeight
        }
      };
      window.addEventListener("resize", this._resize_handler);

      old_handle instanceof Function && old_handle.call(this);
    }
  },
  destroyed(old_handle) {
    return function () {
      this.clearWatch();
      window.removeEventListener("resize", this._resize_handler);
      old_handle instanceof Function && old_handle.call(this);
    }
  },
  props(new_val) {
    const props = Object.assign({}, new_val);
    return props;
  }
};
export function componentWrapper(obj) {
  const res = Object.assign({}, obj);
  if (obj.pagination) {
    const pagination = obj.pagination;
    delete obj.pagination;
    // 加入分页管理的功能
    frameComponentSuper.beforeRouteEnter = (after_handle) => function (to, from, next) {
      console.log("beforeRouteEnter")
      let vm;
      const cbs = [];
      next(_vm => {
        _vm.$watch("$route.query", function (new_query) {
          console.log("query changed", new_query);
          pagination.request(this.$route, cb =>
            cb instanceof Function && cb(this)
          );
        });
        vm = _vm;
        vm.__beforeRoute_load_data__ = true;
        cbs.forEach(cb => cb(vm));
        cbs.length = 0;
      });
      pagination.request(to, (cb) => {
        if (cb instanceof Function) {
          if (!vm) {
            cbs.push(cb)
          } else {
            cb(vm)
          }
        };
      })
      after_handle instanceof Function && after_handle(to, from, next)
    };
    frameComponentSuper.beforeUpdate = (after_handle) => function (...args) {
      console.log("before update",this.__beforeRoute_load_data__);
      if (!this.__beforeRoute_load_data__) {
        console.log("load data")
        this.__beforeRoute_load_data__ = true;
        pagination.request(this.$route, cb =>
          cb instanceof Function && cb(this)
        );
      }
      after_handle instanceof Function && after_handle(...args)
    };
    frameComponentSuper.methods = (new_methods) => {
      return Object.assign({}, new_methods, {
        refreshPage() {
          pagination.request(this.$route, cb =>
            cb instanceof Function && cb(this)
          );
        },
        handleSizeChange(new_size) {
          const router = this.$router;
          const current_route = this.$route;
          const query = Object.assign({}, current_route.query, {
            num: new_size,
            page: 1
          });
          router.push({
            path: current_route.path,
            query
          });
        },
        handleCurrentChange(new_page) {
          const router = this.$router;
          const current_route = this.$route;
          const query = Object.assign({}, current_route.query, {
            page: new_page
          });
          router.push({
            path: current_route.path,
            query
          });
        }
      })
    }
  }
  for (let key in frameComponentSuper) {
    res[key] = frameComponentSuper[key](res[key]);
  }
  return res;
}

export function on(events, eventname, handle) {
  events.on(eventname, handle);
  return function () {
    events.off(eventname, handle);
  }
}
